<!--投票选项 Begin-->

	<!--投票在topic列表中使用时要用到tid-->
	<!--{eval if(!isset($tid))$tid=0;}-->
	<!--{eval $bcid = rand(0, 19);}-->
	<!--{if $vote['tab'] == 1}-->
    
  
    <ol class="poll_item_list vote_pic">

	<!--{loop $option $key $val}-->
	<li>
    <div id="vote_pic_list_{$val[oid]}" class="vote_pic_list">
    <div class="vote_pic_list_p" onclick="imageCheck(this);">
    <a href="javascript:void(0)" title="$val[option]" class="tooltip" target="_blank" name="{$val['picurl_big']}"><img src="{$val['picurl']}" alt="$val[option]" /></a> 
    <span><!--{if $allowedvote && !$hasvoted}-->
    <input type="{$vote['input_type']}" name="option[]" id="vote_{$vote['vid']}_{$val[oid]}" value="$val[oid]" <!--{if $vote[multiple]}-->onclick="checkSelect(this.checked)"<!--{/if}-->/>
	<!--{/if}--></span>
    </div>
    </div>
    
    <div class="vote_pic_text">
    <div class="poll_item_list_check" style="margin:10px 0 5px">
    <label class="poll_item" style=" margin-left:0" for="vote_{$vote['vid']}_{$val[oid]}">$val[option]</label>
	</div>
			
	<!--{if $bcid>19}-->
	<!--{eval $bcid=$bcid-19}-->
	<!--{/if}-->
	<div class="bar_bg bc_$bcid">
	<div class="bar_left"></div>
	<div class="bar_middle" id="bar_{$tid}_$key" len="{$val[width]}"></div>
	<div class="bar_right"></div>
	</div>
	<!--{eval $bcid++;}-->
	<div class="poll_percent">$val[vote_num] ($val[percent]%)</div>
    </div>
	</li>
	<!--{/loop}-->
    </ol>
	<!--{else}-->
    <ol class="poll_item_list">
	<!--{loop $option $key $val}-->
	<li>
    <div class="poll_item_list_check">
	<!--{if $allowedvote && !$hasvoted}-->
	<input type="{$vote['input_type']}" name="option[]" value="$val[oid]" id="vote_{$vote['vid']}_{$val[oid]}" <!--{if $vote[multiple]}-->onclick="checkSelect(this.checked)"<!--{/if}-->/>
	<!--{/if}-->
    <label class="poll_item" for="vote_{$vote['vid']}_{$val[oid]}">$val[option]</label>
	</div>
	<!--{if $bcid>19}-->
	<!--{eval $bcid=$bcid-19}-->
	<!--{/if}-->
	<div class="bar_bg bc_$bcid">
	<div class="bar_left"></div>
	<div class="bar_middle" id="bar_{$tid}_$key" len="{$val[width]}"></div>
	<div class="bar_right"></div>
	</div>
	<!--{eval $bcid++;}-->
	<div class="poll_percent">$val[vote_num] ($val[percent]%)</div>
	</li>
	<!--{/loop}-->
    </ol>
	<!--{/if}-->

<!--投票选项 End-->
<script type="text/javascript">
function imageCheck(obj){
	$(obj).find('input').attr('checked','checked');
}

</script>



<script type="text/javascript">
	
	var __Bar_Name__ = 'bar_{$tid}_';
	function $$$(id)
	{
		return document.getElementById(id);
	}
    <!--{if !$hasvoted}-->
	var maxSelect = $vote[maxchoice];
	var alreadySelect = 0;
	function checkSelect(sel)
	{
		if(sel) {
			alreadySelect++;
			if(alreadySelect == maxSelect) {
				var oObj = document.getElementsByName("option[]");
				for(i=0; i < oObj.length; i++) {
					if(!oObj[i].checked) {
						oObj[i].disabled = true;
					}
				}
			}
		} else {
			alreadySelect--;
			if(alreadySelect < maxSelect) {
				var oObj = document.getElementsByName("option[]");
				for(i=0; i < oObj.length; i++) {
					if(oObj[i].disabled) {
						oObj[i].disabled = false;
					}
				}
			}
		}
	}
	<!--{/if}-->

	//效查
	var optionNum = <!--{eval echo count($option)}-->;
	var maxLength = [0,1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11,12,13,14,15,16,17,18,19];

	var timer;
	var length = 0;
	for(i = 0; i < optionNum; i++)
	{
		if ($$$(__Bar_Name__ + i)) {
			maxLength[i] = $$$(__Bar_Name__ + i).getAttribute('len');
		}
	}
	timer = setInterval(function(){
		setLength();
	}, 40);
	function setLength(){
		for (i = 0; i < optionNum; i++)
		{
			if ($$$(__Bar_Name__ + i)) {
				if (length - 1 >= maxLength[i]) {
					$$$(__Bar_Name__ + i).style.width = maxLength[i] + "px";
				} else {
					$$$(__Bar_Name__ + i).style.width = length + "px";
				}
				length = length + 1;
				if (length > 300) {
					clearInterval(timer);
				}
			}
		}
	}
</script>

<script type="text/javascript">
		$(function(){
			var x = 10;
			var y = 20;
			$("a.tooltip").mouseover(function(e){
				this.myTitle = this.title;
				this.title = "";
				var imgTitle = this.myTitle ? "<br />" + this.myTitle +" 预览图" : "";
				var tooltip = "<div id='tooltip'><img sr"+"c='"+this.name+"' alt='预览图' />"+imgTitle+"</div>";
					$("body").append(tooltip);
					$("#tooltip")
						.css({
							"top": (e.pageY+y) + "px", 
							"max-width":"400px;",
							"left":(e.pageX+x) + "px"
					}).show("fast");
			}).mouseout(function(e){
				this.title = this.myTitle;
				$("#tooltip").remove();
			}).mousemove(function(e){
				$("#tooltip").css({
					"top": (e.pageY+y) + "px",
					"left": (e.pageX+x) + "px"
				});
			});
		})
	</script>
    
	<style type="text/css">
		#tooltip{
			position: absolute;
			background-color: #E6E8E9;
			border: 1px solid #D5DEE3;
			width: 400px;
			height: 420px;
			-webkit-border-radius: 5px;
			font-family: "微软雅黑";
			padding: 10px;
			z-index:100;
		}
	</style>